<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/jareaselect2.css">
    <title>地区选择插件</title>
    <script type="text/javascript" src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
    <script type="text/javascript" src="js/JAreaData.js"></script>
    <script type="text/javascript" src="js/JAreaSelect2.js"></script>

</head>

<body>
<div class="container" style="padding-top: 20px;">
    <p><button class="btn btn-primary">选择区域</button></p>
    <div id="area-select"></div>
</div>


</body>

<script type="text/javascript">
    $(".btn-primary").on("click", function() {
        $("#area-select").JAreaSelect2({
            prov : 1,
            city : 72,
            dist : 2839,

            callback : function(data) {
            	console.log(data);
                $(".btn-primary").html(data.address);
            }
        });
    });
</script>

</html>

